<!DOCTYPE html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>跨源通信-WebChat</title>
	<link rel="stylesheet" href="styles.css">
</head>

<h1>跨源通信门户</h1>
<p><b>源</b>: http://portal.example.com:8080</p>
状态 <input type="text" id="statusText" value="Online">
<button id="sendButton">更改状态</button>
<p>
使用postMessage发送一个状态，以更新包含在此页面中的widgetiframe。
</p>
<iframe id="widget" src="http://chat.example.net:8080/communication/postMessageWidget.html"></iframe>
<script>
	var targetOrigin = "http://chat.example.net:8080";
	var notificationTimer = null;
	function messageHandler(e){
		if(e.origin == targetOrigin){
			notify(e.data);
		}else{
			//忽略
		}
	}
	
	function sendString(s){
		document.getElementById("widget").contentWindow.postMessage(s,targetOrigin);
	}
	function notify(message){
		alert(message);
	}
	function sendStatus(){
		var statusText = document.getElementById("statusText").value;
		sendString(statusText);
	}
	function loadDemo(){
		document.getElementById("sendButton").addEventListener("click",sendStatus,true);
		sendStatus();
	}
	
	window.addEventListener("load",loadDemo,true);
	window.addEventListener("message",messageHandler,true);
</script>


